<template>
	<div class="bind-members">
		<el-dialog :visible.sync="visible" width="35%" :before-close="closeAddLabel">
			<span slot="title" class="el-dialog__title">绑定标签的成员</span>
			<div class="add-content">
				<el-table :data="tableData" border stripe >
				  <el-table-column label="标签名称" prop="name" :width="160" align="center"></el-table-column>
				  <el-table-column label="标签成员" prop="members" align="center"></el-table-column>
				</el-table>
			</div>
			<span slot="footer" class="dialog-footer">
				<el-button class="sure" @click="closeAddLabel">确 定</el-button>
			</span>
		</el-dialog>
	</div>
</template>

<script>

export default {
	props: {
		visible: {
			type: Boolean,
			required: true,
			default: () => false
		},

		tableData: {
			type: Object,
			required: true,
			default: () => undefined
		}
	},

	methods: {
		closeAddLabel() {
			this.$emit('close');
		}
	}
}
</script>

<style lang="less">
.bind-members {
	.el-dialog__body {
		padding: 10px 20px;
	}
	.el-input {
		input {
			height: 32px;
		}
	}
}
</style>

<style lang="less" scoped>
.bind-members {
	.el-button {
		width: 56px;
		height: 32px;
		padding: 0;
		font-size: 14px;
	}
	.close {
		color: #999;
	}
	.sure {
		background-color: #6384fe;
		color: #fff;
	}
	.error {
		position: absolute;
		top: 104px;
		padding-left: 140px;
		color: #ff3b30;
	}
}
</style>